{% extends 'base.html' %}
{% load staticfiles %}
{% block aside %}
{% load post_tags %}
<section class="vbox">
<section class="scrollable wrapper-lg">
  <div class="row" style="height: 95%; width: 100%; margin:0; min-height: 650px ">
    <div class="col-sm-9" style="padding: 0; height: 50px">
        {% get_post_categories as post_category_list %}
        <div class="form-group" style="float: left; margin-bottom: 10px; height: 30px; width: 80%">
            <a href="{% url 'post:post' %}">
                <button type="submit" class="btn btn-info">全部主题</button>
            </a>
            {% for post_category in post_category_list %}
            <a href="{% url 'post:post_category' post_category.pk %}">
                <button type="submit" id="{{ post_category.name }}" class="btn btn-info">{{ post_category.name }}</button>
            </a>
            {% endfor %}
        </div>
        <div class="form-group" style="float: left; margin-bottom: 10px; height: 30px; width: 20%">
            {% if user.is_authenticated %}
                <a href="{% url 'post:post_publish' %}?next={{ request.path }}">
                    <button type="submit" style="float: right" class="btn btn-info">发布主题</button>
                </a>
            {% else %}
                <a onclick="toast_warning()">
                    <button type="submit" style="float: right" class="btn btn-info">发布主题</button>
                </a>
            {% endif %}
        </div>
    </div>
    <div style="float: left; height: 90%; width: 75%; padding-top: 10px">
        <ul class="blog-post" style="height: 85%;padding-left: 0; list-style: none; display: flex; flex-direction: column; margin-bottom: 0">
          {% for post in post_list %}
            <li class="post-item" style="height: 25%">
              <div class="caption wrapper-lg" style="padding: 20px">
                <h2 class="post-title"><a href="{{ post.get_absolute_url }}">{{ post.title }}</a></h2>
                <div class="post-sum">
                  <p>{{ post.summary }}</p>
                </div>
                <div class="line line-lg" style="margin-top: 1%; margin-bottom: 0.5%"></div>
                <div class="text-muted">
                    {% if user.is_authenticated %}
                        <i class="fa fa-user icon-muted"></i> by <a href="{% url 'user:show_another' post.user_id %}" class="m-r-sm">{{ post.user.username }}</a>
                    {% else %}
                        <i class="fa fa-user icon-muted"></i> by <a href="javascript:void(0)" onclick="toast_warning()" class="m-r-sm">{{ post.user.username }}</a>
                    {% endif %}
                  <i class="fa fa-clock-o icon-muted"></i> {{ post.publish_time }}
                </div>
              </div>
            </li>
          {% empty %}
              <h2 style="margin-left: 0.5%">这个板块还没有人来过哦!</h2>
          {% endfor %}
        </ul>
        <div class="text-center m-t-lg m-b-lg" style="height: 13%">
          <ul class="pagination pagination">
          {% if is_paginated %}
            <li><a href="#"><i class="fa fa-chevron-left"></i></a></li>
              {% if first %}
                <li class="active"><a href="#">1</a></li>
              {% endif %}
              {% if left %}
                {% if left_has_more %}
                    <span>...</span>
                {% endif %}
                {% for i in left %}
                    <li><a href="?page={{ i }}">{{ i }}</a></li>
                {% endfor %}
            {% endif %}
              <li><a href="?page={{ page_obj.number }}" style="color: hotpink">{{ page_obj.number }}</a></li>
            {% if right %}
                {% for i in right %}
                    <li><a href="?page={{ i }}">{{ i }}</a></li>
                {% endfor %}
                {% if right_has_more %}
                    <span>...</span>
                {% endif %}
            {% endif %}
            {% if last %}
                <li><a href="?page={{ paginator.num_pages }}">{{ paginator.num_pages }}</a></li>
            {% endif %}
            <li><a href="#"><i class="fa fa-chevron-right"></i></a></li>
{#          {% else %}#}
{#              <li><a href="#"><i class="fa fa-chevron-left"></i></a></li>#}
{#                <li class="active"><a href="#">1</a></li>#}
{#              <li><a href="#"><i class="fa fa-chevron-right"></i></a></li>#}
          {% endif %}
          </ul>
        </div>
    </div>
    <div class="col-sm-3" style="margin-top: -50px; padding-left: 2%">
      <div class="panel panel-default">
        <div class="panel-heading">最新主题</div>
        <div class="panel-body">
        {% for recent in recent_list %}
            {% if user.is_authenticated %}
              <article class="media">
                <a href="{% url 'user:show_another' recent.user_id %}" class="pull-left thumb thumb-wrapper m-t-xs">
                  <img src="{{ recent.user.avatar.url }}">
                </a>
                <div class="media-body">
                  <a href="{{ recent.get_absolute_url }}" class="font-semibold">{{ recent.title }}</a>
                  <div class="text-xs block m-t-xs" style="white-space:nowrap;overflow:hidden;text-overflow: ellipsis">{{ recent.summary }}</div>
                  <div class="text-xs block m-t-xs"><a href="{% url 'user:show_another' recent.user_id %}">{{ recent.user.username }}</a> 发布于 {{ recent.publish_time }}</div>
                </div>
              </article>
            {% else %}
                <article class="media">
                <a href="javascript:void(0)" onclick="toast_warning()" class="pull-left thumb thumb-wrapper m-t-xs">
                  <img src="{{ recent.user.avatar.url }}">
                </a>
                <div class="media-body">
                  <a href="{{ recent.get_absolute_url }}" class="font-semibold">{{ recent.title }}</a>
                  <div class="text-xs block m-t-xs" style="white-space:nowrap;overflow:hidden;text-overflow: ellipsis">{{ recent.summary }}</div>
                  <div class="text-xs block m-t-xs"><a href="javascript:void(0)" onclick="toast_warning()">{{ recent.user.username }}</a> 发布于 {{ recent.publish_time }}</div>
                </div>
              </article>
            {% endif %}
        {% endfor %}
        </div>
      </div>
    </div>
  </div>
</section>
<script src="{% static 'js/jquery.min.js' %}"></script>
<script type="text/javascript">
  ele = $("#{{ c_id }}:contains('{{ c_id }}')");
  ele.removeClass('btn-info');
  ele.addClass('btn-primary');
</script>
{% endblock %}